<!--
 * @Author: 卡卡 1071780426@qq.com
 * @Date: 2022-11-02 13:13:25
 * @LastEditors: 卡卡 1071780426@qq.com
 * @LastEditTime: 2023-03-27 14:37:19
 * @FilePath: \backstage - 副本\src\views\aa.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div>
        <el-button type="primary" @click="dialog = true" size="mini">点击打开 Dialog</el-button>
        <!-- dialogUpload dialogUpload = true-->
        <el-button type="primary" @click="clickUpload" size="mini">上传文件</el-button>
        <upload :dialogUpload="dialogUpload" @closes="closeDialog" fileType="1" folderid="file99" @upFileList="getFile">
        </upload>
        <el-button type="primary" @click="clickUpload1" size="mini">上传文件</el-button>
        <upload :dialogUpload="dialogUpload1" @closes="closeDialog" fileType="0" folderid="file88" @upFileList="getFile">
        </upload>


        <!-- select用法 -->
        <!-- 调接口，字典项 -->
        <selects v-model="form.aa" typeText="1" defaultText='Piercategory'></selects>
        <!--option为数组包对象 需要返回一个对象，例如字符串、id -->
        <selects v-model="form.bb" typeText="2" :option="option" nodeKey="fItemName" @select="select"></selects>
        <!-- 简单数组例如 ["是"，"否] -->
        <selects v-model="form.cc" typeText="3" :option="option1"></selects>
        <!-- select用法 -->
        <div @click="getform">888888</div>
        <div class="Control-1">
            <el-dialog v-dialogDrag title="提示" :visible.sync="dialog" :modal-append-to-body="false">
                <div class="dialogBody common" style="height:600px">
                    <publicForm ref="publicForm" :formObj="formObj" :formData="formData"
                        :searchSelectOptionsCb="searchSelectOptionsCb" @selectChange="selectChange" @inputINPUT="inputINPUT"
                        @inputChange="inputChange" @querySelectValue="querySelectValue" @formSwitchChange="formSwitchChange"
                        @buttonClick="buttonClick">
                    </publicForm>
                    <span slot="footer" class="dialog-footer">
                        <el-button type="primary" @click="dialogOK">确认</el-button>
                        <el-button @click="dialog = false">取 消</el-button>
                    </span>
                </div>
            </el-dialog>
        </div>
    </div>
</template>
 
<script>
import publicForm from "@/components/public/el-form.vue"
import upload from "@/components/public/el-upload.vue"
import selects from "@/components/public/el-select.vue"


import formJs from './regex.js'
export default {
    components: {
        publicForm,
        upload,
        selects
    },
    data() {
        return {
            dialogUpload: false,
            dialogUpload1: false,
            dialog: false, //弹出框
            formObj: formJs.formObj,
            formData: formJs.formData,
            searchSelectOptionsCb: [], //form表单搜索select返回值
            lableWidth: '80px',
            timestamp: '7777',
            form: {
                aa: "12",
                bb: "36",
                cc: "66"
            },
            option1: ["3", "4", "5", "6"],
            option: [
                {
                    fItemName: "施工单位自检",
                    fItemValue: "施工单位自检",
                }, {
                    fItemName: "监理单位抽检",
                    fItemValue: "监理单位抽检",
                }, {
                    fItemName: "中试单位抽检",
                    fItemValue: "中试单位抽检",
                },
            ],//检测类型 - 根据当前登录用户获取检测类型
        };
    },

    watch: {
        dialog(newVal, oldVal) {
            console.log(oldVal);
            if (!newVal) {
                this.$refs.publicForm.resetForm(); //窗口关闭清空表单
            }
        },
    },
    methods: {
        select(e) {
            this.form.bb = e.fItemName
            console.log(e);
        },
        getform() {
            console.log(this.form);
        },
        closeDialog() {
            this.dialogUpload = false
        },
        clickUpload() {
            this.dialogUpload = true
        },
        clickUpload1() {
            this.dialogUpload1 = true
        },
        getFile(val) {
            console.log(val);
        },
        // select选择框变化
        selectChange(value, index, prop) {
            console.log(value, index, prop)
        },
        // inpuit变化
        inputINPUT(value, index, prop) {
            console.log(value, index, prop)
        },
        // inpuit Change
        inputChange(value, index, prop) {
            console.log(value, index, prop)
        },
        // select 搜索值
        querySelectValue(value, index, prop) {
            console.log(value, index, prop)
            let arr = [{
                label: '搜索返回1号',
                value: 1
            }, {
                label: '搜索返回2号',
                value: 2
            }];
            this.searchSelectOptionsCb = arr;
        },
        // form表单switch变化
        formSwitchChange(val, index, prop) {
            console.log(val, index, prop)
        },
        // 按钮点击
        buttonClick(index, prop) {
            console.log(index, prop)
        },
        dialogOK() {
            //判断表单验证是否通过
            if (this.$refs.publicForm.submitForm()) {
                console.log("success");
                console.log(this.formData)
            } else {
                console.log("error")
            }
        },
    }
}
</script>
 
<style lang="less" scoped></style>
